<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/css/detail.css}">
    <link rel="stylesheet" th:href="@{/css/comment.css}">
</head>
<body>
<div class="content">
<div class="bookInFor">
    <div class="bookL">

            <img th:each="book: ${book}" th:src="${book.bookCoverJpg}" alt="" height="253" width="180" class="adc"/>

        <img th:src="@{/img/shadow.png}" alt="" class="shadow">
    </div>
    <div class="bookR">
        <div class="book01">
            <div class="bookName">
                <h2><a th:each="book: ${book}" th:text="${book.book_name}" ></a></h2>

            </div>
                <span style="margin-right: 12px;"><b th:each="book: ${book}" th:text="${book.book_name}" ></b></span>
                <span style="margin-right: 12px;">价格：<b th:each="book: ${book}" th:text="${book.book_price}" ></b></span>
                <span style="margin-right: 12px;">销量：<b th:each="book: ${book}" th:text="${book.book_sales}" ></b></span>
                <span style="margin-right: 12px;">借阅次数：<b th:each="book: ${book}" th:text="${book.book_borrow}" ></b></span>
                                                  </p>
        </div>
        <div class="book02">
            <div class="left">
                <thead>

                <p class="price" >上架日期:<a class="price" th:each="book: ${book}" th:text="${book.create_date}"></a></p>
                <p class="price" >更新日期:<a class="price" th:each="book: ${book}" th:text="${book.update_date}"></a></p>

<form action="/borrowBook" method="post" th:each="book: ${book}" >
    <button id="borrow-btn" type="submit" name="book_id"   th:value="${book.book_id}"
            class="custom-btn btn-2" >借阅</button>
</form>
                <form action="/addBookInCart" method="post" th:each="book: ${book}" >
                    <button id="buy-btn" type="submit" name="book_id"   th:value="${book.book_id}"
                            class="custom1-btn btn1-2" >加入购物车</button>
                </form>



            </div>

        </div>
        <div class="book03">
            <p th:each="book: ${book}" th:text="${book.book_detail}" >
                </p>
            <div class="shareWrap">
                <span><a>展开<s></s></a></span>
            </div>
        </div>
    </div>
</div>

    <form action="/addComm" method="POST" class="comment-form">
        <input type="hidden" name="book_id" th:each="book: ${book}" th:value="${book.book_id}" />
        <label for="comment" class="form-label">一条友善的评论：</label>
        <textarea id="comment" name="comment" required class="form-control"></textarea>
        <button type="submit" class="btn btn-primary">提交</button>
    </form>
<br><br><br>
    <table class="table">
        <thead>
        <tr>
            <th>用户</th>
            <th> &nbsp;&nbsp;&nbsp; </th>
            <th>评论内容</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="comms: ${comms}">
            <td th:text="${comms.user_id}"></td>
            <td>&nbsp;&nbsp;&nbsp;</td>
            <td th:text="${comms.comm}"></td>
        </tr>
        </tbody>
    </table>
</div>
<script>
    // 通过ID获取借阅按钮
    var borrowBtn = document.getElementById("borrow-btn");

    // 给借阅按钮绑定一个点击事件
    borrowBtn.onclick = function() {
            // 显示相应的弹窗，根据操作结果
                alert("借阅成功！");
    };
</script>

</body>
</html>